"use client";
import { Tabs } from "antd";
import { useEffect, useState } from "react";
import BrushQuestion from "./components/BrushQuestion";
import EmptyBox from "./components/EmptyBox";
import GoodBag from "./components/GoodBag";
import QuestionList from "./components/QuestionList";
import "./index.css";

const { TabPane } = Tabs;

interface LikeItem {
    id: number;
    subjectId: number;
    subjectName: string;
    likeUserId: string;
    status: number;
    createdBy: string;
    createdTime: string;
    updateBy: string;
    updateTime: string;
    isDeleted: number;
}

interface LikeRecordProps {
    userId?: string;
}

const LikeRecord: React.FC<LikeRecordProps> = ({ userId }) => {
    const [activeTab, setActiveTab] = useState("1");
    const [likeData, setLikeData] = useState<{
        pageNo: number;
        pageSize: number;
        total: number;
        totalPages: number;
        result: LikeItem[];
        start: number;
        end: number;
    }>({
        pageNo: 1,
        pageSize: 10,
        total: 0,
        totalPages: 0,
        result: [],
        start: 0,
        end: 0,
    });
    const [loading, setLoading] = useState(false);

    // 模拟获取点赞数据
    const fetchLikeData = async (page: number, pageSize: number) => {
        setLoading(true);
        try {
            // 这里应该是实际的API调用
            // const response = await fetch(`/api/likes?userId=${userId}&page=${page}&pageSize=${pageSize}`);
            // const data = await response.json();

            // 模拟数据
            const mockData = {
                pageNo: page,
                pageSize: pageSize,
                total: 25,
                totalPages: Math.ceil(25 / pageSize),
                result: Array(pageSize)
                    .fill(null)
                    .map((_, index) => ({
                        id: (page - 1) * pageSize + index + 1,
                        subjectId: (page - 1) * pageSize + index + 1,
                        subjectName: `题目 ${(page - 1) * pageSize + index + 1}`,
                        likeUserId: userId || "user123",
                        status: 1,
                        createdBy: "system",
                        createdTime: new Date().toISOString(),
                        updateBy: "system",
                        updateTime: new Date().toISOString(),
                        isDeleted: 0,
                    })),
                start: (page - 1) * pageSize,
                end: page * pageSize,
            };

            setLikeData(mockData);
        } catch (error) {
            console.error("获取点赞数据失败:", error);
        } finally {
            setLoading(false);
        }
    };

    useEffect(() => {
        fetchLikeData(likeData.pageNo, likeData.pageSize);
    }, []);

    const handlePageChange = (page: number, pageSize: number) => {
        fetchLikeData(page, pageSize);
    };

    const handleTabChange = (key: string) => {
        setActiveTab(key);
    };

    return (
        <div className="like-record-container">
            <Tabs activeKey={activeTab} onChange={handleTabChange}>
                <TabPane tab="点赞记录" key="1">
                    {likeData.result.length > 0 ? (
                        <GoodBag
                            data={likeData}
                            onPageChange={handlePageChange}
                            loading={loading}
                        />
                    ) : (
                        <EmptyBox />
                    )}
                </TabPane>
                <TabPane tab="刷题记录" key="2">
                    <BrushQuestion />
                </TabPane>
                <TabPane tab="题目列表" key="3">
                    <QuestionList />
                </TabPane>
            </Tabs>
        </div>
    );
};

export default LikeRecord;
